<template>
  <div class="app-flex app-column app-height-100wh" style="background: #f2f3f7">
    <div class="app-v-center app-word-nowrap app-z-index-100 app-white pt-3">
      <div class="px-3 app-v-center app-h-end app-h-56px pb-3 app-fill-width">
        <div class="px-6 app-font-14 app-flex-1">{{ '奖品物流管理' }}</div>
        <div class="app-v-center mr-3">
          {{ userInfo && userInfo.mobile }}
        </div>
        <!-- <img class="app-fill" :src="avatar"> -->
        <div class="right-menu">
          <el-dropdown class="avatar-container" trigger="hover">
            <div class="pr-5 app-v-center app-pointer" style="color: #aaa;">
              {{ userInfo && userInfo.name }}<i class="el-icon-caret-bottom" />
            </div>
            <el-dropdown-menu slot="dropdown" class="user-dropdown">
              <router-link to="/">
                <el-dropdown-item>
                  Home
                </el-dropdown-item>
              </router-link>
              <el-dropdown-item divided @click.native="logout">
                <span style="display:block;">退出</span>
              </el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </div>
      </div>
    </div>
    <router-view />
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import { clearCookies } from '@/utils/auth'
export default {
  data: () => ({
    tab: 0,
    backMenu: false,
    userInfo: null
  }),
  computed: {
    ...mapGetters([
      'sidebar',
      'avatar',
      'name',
      'username',
      'userId'
    ])
  },
  mounted() {
    if (localStorage.getItem('userInfo')) {
      this.userInfo = JSON.parse(localStorage.getItem('userInfo'))
      // getMenu().then(res => {
      //   this.backMenu = res.data.some(m => m.name === '系统管理')
      // })
    } else {
      this.logout()
    }
  },
  methods: {
    async logout() {
      clearCookies()
      localStorage.clear()
      sessionStorage.clear()
      this.$router.push(`/login?redirect=${this.$route.fullPath}`)
    },
    toBackStage() {
      this.$router.push({ name: 'orgUser' })
    }
  }
}
</script>

<style scoped lang="scss">
.top-container {
  border-radius: 0 0 15px 15px;
}
.left-part {
  width: 400px;
}
.bg-purple {
  background: #d3dce6;
}
.bg-purple-light {
  background: #e5e9f2;
}
.grid-content {
  border-radius: 4px;
  min-height: 36px;
}

/*滚动条样式*/
::-webkit-scrollbar {
    width: 0px;
    /*height: 4px;*/
}
</style>
